<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>宝典 - 手机客户端</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no"/>
<link rel="stylesheet" href="css/style.css" />
<link rel="stylesheet" href="css/buttons.css" />
<script src="js/jquery.js"></script>
<script src="js/touchslider.js"></script>
<script src="js/jquery.global.js"></script>
<script type="text/javascript">
	var id = new Array();
	var loadList = function(index){
		index=index==0?0:index-1;
		//alert($(".wrap #treeList dl dd ul:eq(1)").parent().prev().html());
		$loadAjax = new $.LoadAjax({
			renderTarget : ".wrap #treeList dl dd ul:eq("+index+")",
			fn : function(obj,data,mask){
				if(data.length==0){
					$(mask).remove();
					$(obj).text().trim()==""?$(obj).html('暂无匹配的应用'):null;
				}else{
					for(var i in data){	
						$(obj).append('<li data-appId="'+data[i].appId+'" data-id="'+data[i].id+'"><dl><dd><img src="'+requestPicPath+data[i].picPath+'" /></dd><dt><strong>'+data[i].name+'</strong>'+(data[i].appVersion==null?'':'<span>版本:'+data[i].appVersion+'</span>|')+'<span>大小:'+data[i].size+'MB</span></dt><dd><button data-url="'+requestPicPath+data[i].url+'">免费下载</button>'+data[i].downloadTimes+'次</dd></dl></li>');
					}
				}
			},
			url : requestPath+"/websamp/pubapi/mobile/mobileRpDetail?id="+id[index],
			picPath : requestPicPath
		});
		//alert(index);
		$loadAjax.init();
		$loadAjax.loadAppList();
	};
		
	$(function($){
		var $switchover = new $.Switchover({
			obj : ".wrap #treeList.tree.closed>dl>dt:not(.current)",
			fn : function(obj){
				obj.next().slideDown().siblings("dd").slideUp();
				//alert(obj.next().children("ul").is(":empty"));
				obj.next().children("ul").is(":empty")>0?loadList($switchover.getIndex()):null;
				//loadList($switchover.getIndex());
			},
			index : 0
		});

		var $loadAjax = new $.LoadAjax({
			renderTarget : ".wrap #treeList dl",
			fn : function(obj,data,mask){
					if(data.length==0){
						$(mask).remove();
						$(obj).text()?$(obj).html('暂无匹配的应用'):null;
					}else{
						for(var i in data){		
							$(obj).append('<dt data-id="'+data[i].id+'"><a href="javascript:;">'+data[i].name+'</a></dt><dd><ul></ul></dd>');
							id.push(data[i].id);
						}
						$switchover.init();
						loadList($switchover.getIndex());
						new $.Switchover().init();
					}
			},
			url : requestPath+"/websamp/pubapi/mobile/mobileRp?operSystem=51&catalog="+getUrlParam("catalog"),
			picPath : requestPicPath,
		});
		$loadAjax.init();
		$loadAjax.loadAppList();
		new $.Download({obj : ".wrap ul li dl dd button"}).init();
	});
</script>
</head>
<body>
<div class="wrap">
  <div id="banner">
    <div>
      <ol>
        <li><a href="javascript:;"><img src="images/banner_01.jpg" /></a></li>
        <li><a href="javascript:;"><img src="images/banner_02.jpg" /></a></li>
        <li><a href="javascript:;"><img src="images/banner_03.jpg" /></a></li>
      </ol>
    </div>
  </div>
  <div id="treeList" class="panel list tree closed">
    <dl>
    </dl>
  </div>
</div>
<script type="text/javascript">
console=window.console || {dir:new Function(),log:new Function()}
new TouchSlider({id:'banner',direction:'right',auto:1,mouseWheel:true});
</script>
</body>
</html>